<include file="common/header" />
<div class="main-container">
    <div class="container">
        <div class="content user-setting">
            <div class="clearfix mb25 top-title hidden-xs">
                <h1 class="text-center f18 fb">头像修改</h1>
                <a href="/user.html" class="ui-btn ui-btn-red ui-btn-mi btn-user-back">返回个人中心</a>
            </div>
            <div class="clearfix mb10 top-title visible-xs">
                <h1 class="text-center f18 fb">头像修改</h1>
                <a href="/user.html" class="btn-user-back">返回个人中心</a>
            </div>
            <div class="row visible-xs">
                <ul class="user-left-nav-min">
                    <li class="col-xs-5">
                        <a href="/user/profile.html">资料修改</a>
                    </li>
                    <li class="col-xs-5 col-xs-offset-2">
                        <a href="/user/password.html">密码修改</a>
                    </li>
                </ul>
            </div>
            <div class="row visible-xs">
                <ul class="user-left-nav-min">
                    <li class="active col-xs-5">
                        <a href="/user/avatar.html">头像修改</a>
                    </li>
                    <li class="col-xs-5 col-xs-offset-2">
                        <a href="/user/address.html">收件地址管理</a>
                    </li>
                </ul>
                <ul class="user-left-nav-min">
                    <li class="col-xs-5">
                        <a href="/user/protect.html">手机设置</a>
                    </li>
                </ul>
            </div>
            <div class="wrap-user-setting row">
                <ul class="user-left-nav col-xs-3 hidden-xs">
                    <li>
                        <a href="/user/profile.html">资料修改</a>
                    </li>
                    <li>
                        <a href="/user/password.html">密码修改</a>
                    </li>
                    <li class="active">
                        <a href="/user/avatar.html">头像修改</a>
                    </li>
                    <li>
                        <a href="/user/address.html">收件地址管理</a>
                    </li>
                    <li>
                        <a href="/user/protect.html">手机设置</a>
                    </li>
                </ul>
                <div class="col-xs-9">
                    <div class="default-avatar">
                        <img id="avatar_id" style="width:200px;height:200px;" src="{$user.avatar_big}">
                    </div>
                    <div class="clearfix text-center mb20" style="width:200px;">
                        上传200*200的图片
                    </div>
                    <!--dom结构部分-->
                    <div id="uploader-demo">
                        <!--用来存放item-->
                        <div id="fileList" class="uploader-list"></div>
                        <div id="filePicker" class="ui-btn ui-btn-blue ui-btn-default">选择图片</div>
                    </div>
                </div>
            </div>

        </div>

    </div>
</div>
<script type="text/javascript">
    $(document).ready(function() {
        var uploader = WebUploader.create({
            auto: true,
            chunked: false,
            method: 'POST',
            disableGlobalDnd: true,
            fileNumLimit: 1,
            //fileSizeLimit: 1024000,
            swf: '/javascript/home/webuploader/Uploader.swf',
            server: '{$WEB_DOMAIN}/User/avatar/',
            pick: '#filePicker',
            accept: {
                title: '选择头像图片',
                extensions: 'gif,jpg,jpeg,png',
                mimeTypes: 'image/*'
            }
        });
        uploader.on('uploadSuccess', function (file,response) {
            var data = JSON.parse(response._raw);
            $('#avatar_id').attr('src',data.result + '?rand='+Math.random());
            uploader.reset();
        });
    });
</script>
<include file="common/footer" />